<!DOCTYPE html>
<html lang="ru" xml:lang="ru">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>{% block title %}{% endblock %}</title>

  <link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
  <link href="/static/css/page_template.css" rel="stylesheet" />
  <link href="/static/css/variables.css" rel="stylesheet" />
  <link href="/static/css/sidebar.css" rel="stylesheet" />
  <link href="/static/css/tabs.css" rel="stylesheet" />
  <link href="/static/css/board.css" rel="stylesheet" />
  <link href="/static/css/page-header.css" rel="stylesheet" />
  <link href="/static/css/lib_scrollbar.css" rel="stylesheet" />
  <link href="/static/css/breadcrumbs.css" rel="stylesheet" />
  <link href="/static/bootstrap-icons/bootstrap-icons.css" rel="stylesheet" />
  <link href="/static/css/prettify.css" rel="stylesheet" />
  {% block styles %}{% endblock %}

  <script src="/static/js/jquery-3.6.0.min.js"></script>
  <script src="/static/bootstrap/js/bootstrap.bundle.min.js"></script>
  <script src="/static/js/escape.html.js"></script>
  <script src="/static/js/prettify.js"></script>
  <script src="/static/js/jquery.scrollbar.js"></script>
  <script>
    var document_ready_functions = [];
  </script>
</head>

<body>
  <div class="wrapper">

    {#-- Левое вертикальное боковое меню в развёрнутом виде --#}
      <nav id="sidebarMenu" class="left-sidebar sidebar--visible">
        <div class="scrollbar-container ps ps--active-y scrollbar-macosx">
          {#-- Заголовок бокового меню --#}
            <div class="sidebar-header">
              {#-- Кнопка перехода на главную страницу --#}
                <a class="sidebar-logo" href="/"
                    alt="На главную страницу Farado">
                </a>
              {#-- /Кнопка перехода на главную страницу --#}

              {#-- Кнопка сворачивания бокового меню --#}
              <button
                  id="close-menu-button"
                  aria-label="Close menu"
                  class="close-burger">
                <img src="/static/images/icon/close-icon.svg" class="icon">
              </button>
              {#-- /Кнопка сворачивания бокового меню --#}
            </div>
          {#-- /Заголовок бокового меню --#}

          {#-- Глваные пункты бокового меню --#}
            <div class="main-nav">
              {#-- Макрос создания пункта бокового меню. --#}
                {%- macro MENU_ITEM(active_name, name, address, caption, icon) -%}
                  <li class="nav-item">
                    <a  {% if active_name == name -%}
                          class="nav-link active"
                          aria-current="page"
                        {%- else -%}
                          class="nav-link"
                        {%- endif %} href="{{ address }}">
                      <i class="{{ icon }} nav-icon mr-8"></i>
                      {{ caption }}
                    </a>
                  </li>
                {%- endmacro -%}
              {#-- /Макрос создания пункта бокового меню. --#}

              <ul class="nav flex-column mb-3">
                {{ MENU_ITEM(
                      active_name=active_menu,
                      name="projects",
                      address="/projects",
                      caption="Проекты",
                      icon="bi bi-briefcase-fill")
                }}
                {{ MENU_ITEM(
                      active_name=active_menu,
                      name="issues",
                      address="/issues",
                      caption="Запросы",
                      icon="bi bi-card-heading")
                }}
                {{ MENU_ITEM(
                      active_name=active_menu,
                      name="boards",
                      address="/boards",
                      caption="Доски",
                      icon="bi bi-kanban")
                }}
                {{ MENU_ITEM(
                      active_name=active_menu,
                      name="active_issues",
                      address="/issues/active_issues",
                      caption="Активные запросы",
                      icon="bi bi-hammer")
                }}
                {{ MENU_ITEM(
                      active_name=active_menu,
                      name="report",
                      address="/issues/report",
                      caption="Отчёт",
                      icon="bi bi-receipt-cutoff")
                }}

                {#-- Глваные пункты бокового меню администратора --#}
                  {% if restriction.is_admin %}
                    {{ MENU_ITEM(
                          active_name=active_menu,
                          name="users",
                          address="/users",
                          caption="Пользователи",
                          icon="bi bi-people-fill")
                    }}
                    {{ MENU_ITEM(
                          active_name=active_menu,
                          name="roles",
                          address="/roles",
                          caption="Роли",
                          icon="bi bi-shield-shaded")
                    }}
                    {{ MENU_ITEM(
                          active_name=active_menu,
                          name="workflows",
                          address="/workflows",
                          caption="Рабочие процессы",
                          icon="bi bi-diagram-3")
                    }}
                    {{ MENU_ITEM(
                          active_name=active_menu,
                          name="issue_kinds",
                          address="/issue_kinds",
                          caption="Типы запросов",
                          icon="bi bi-card-checklist")
                    }}
                    {{ MENU_ITEM(
                          active_name=active_menu,
                          name="logs",
                          address="/logs",
                          caption="Логи",
                          icon="bi bi-terminal")
                    }}
                  {% endif %}
                {#-- /Глваные пункты бокового меню администратора --#}

              </ul>
            </div>
          {#-- /Глваные пункты бокового меню --#}

          {# Пункты меню по ролям #}
            {# INFO : Здесь небольшой overhead для определения нужно нам вообще
                      делать меню или нет. #}
            {% set has_role_menu = namespace(value=false) %}
            {% set roles_by_user = project_manager.roles_by_user(user.id) %}
            {% for role in roles_by_user if role.menu_items|length %}
              {% set has_role_menu.value = true %}
              {% break %}
            {% endfor %}
            {% if has_role_menu.value %}
              <div class="main-nav">
                <div class="projects-list">
                  {% for role in roles_by_user if role.menu_items|length %}
                    <div class="accordion accordion-flush" id="accordionFlushExample">
                      <div class="accordion-item">
                        <h2 class="accordion-header" id="flush-heading{{role.id}}">
                          <button
                              class="accordion-button collapsed"
                              type="button"
                              data-bs-toggle="collapse"
                              data-bs-target="#flush-collapse{{role.id}}"
                              aria-expanded="false"
                              aria-controls="flush-collapse{{role.id}}">
                            <i class="{{ role.icon|e }} mr-8"></i>
                            <span class="name">{{ role.caption|e }}</span>
                          </button>
                        </h2>
                        <div
                            id="flush-collapse{{role.id}}"
                            class="accordion-collapse collapse"
                            aria-labelledby="flush-heading{{role.id}}">
                          <div class="accordion-body">
                            <ul class="btn-toggle-nav nav flex-column">
                              {% for menu_item in role.menu_items %}
                                <li class="nav-item">
                                  <a  href="{{ menu_item.link|e }}"
                                      class="nav-link item-row">
                                    <i class="{{ menu_item.icon|e }} mr-8"></i>
                                    <span class="project-name">
                                      {{- menu_item.caption|e -}}
                                    </span>
                                  </a>
                                </li>
                              {% endfor %}
                            </ul>
                        </div>
                      </div>
                    </div>
                  {% endfor %}
                </div>
              </div>
            {% endif %}
          {# /Пункты меню по ролям #}
        </div>
      </nav>
    {#-- /Левое вертикальное боковое меню в развёрнутом виде --#}

    {#-- Левое вертикальное боковое меню в свернутом виде --#}
      <div
          class="d-flex flex-column flex-shrink-0 align-items-center small-sidebar hidden"
          id="open-menu">
        {#-- Кнопка перехода на главную страницу --#}
          <a href="/" class="d-block p-3 link-dark text-decoration-none">
            <img src="/static/images/icon/small-logo.svg" class="logo">
          </a>
        {#-- /Кнопка перехода на главную страницу --#}

        {#-- Кнопка разворачивания бокового меню --#}
          <div class="btn-padding">
            <button
                aria-label="Open menu"
                class="open-button"
                id="open-menu-button">
              <img src="/static/images/icon/open-sidebar.svg" class="icon">
            </button>
          </div>
        {#-- /Кнопка разворачивания бокового меню --#}

        <div class="scrollbar-macosx">
          {#-- Глваные пункты бокового меню --#}
            <ul class="list-unstyled">
              {#-- Макрос создания пункта бокового меню. --#}
                {%- macro FOLDED_MENU_ITEM(active_name, name, address, caption, icon) -%}
                  <li class="nav-item">
                    <a  {% if active_name == name -%}
                          class="sidebar-link active"
                          aria-current="page"
                        {%- else -%}
                          class="sidebar-link"
                        {%- endif %} href="{{ address }}">
                      <i class="{{ icon }} small-sidebar-icon"></i>
                      <span class="sidebar-link-title">{{ caption }}</span>
                    </a>
                  </li>
                {%- endmacro -%}
              {#-- /Макрос создания пункта бокового меню. --#}

              {{ FOLDED_MENU_ITEM(
                    active_name=active_menu,
                    name="projects",
                    address="/projects",
                    caption="Проекты",
                    icon="bi bi-briefcase-fill")
              }}
              {{ FOLDED_MENU_ITEM(
                    active_name=active_menu,
                    name="issues",
                    address="/issues",
                    caption="Запросы",
                    icon="bi bi-card-heading")
              }}
              {{ FOLDED_MENU_ITEM(
                    active_name=active_menu,
                    name="boards",
                    address="/boards",
                    caption="Доски",
                    icon="bi bi-kanban")
              }}
              {{ FOLDED_MENU_ITEM(
                    active_name=active_menu,
                    name="active_issues",
                    address="/issues/active_issues",
                    caption="Активные запросы",
                    icon="bi bi-hammer")
              }}
              {{ FOLDED_MENU_ITEM(
                    active_name=active_menu,
                    name="report",
                    address="/issues/report",
                    caption="Отчёт",
                    icon="bi bi-receipt-cutoff")
              }}

              {#-- Глваные пункты бокового меню администратора в свёрнутом виде --#}
                {% if restriction.is_admin %}
                  {{ FOLDED_MENU_ITEM(
                        active_name=active_menu,
                        name="users",
                        address="/users",
                        caption="Поль-<br>зователи",
                        icon="bi bi-people-fill")
                  }}
                  {{ FOLDED_MENU_ITEM(
                        active_name=active_menu,
                        name="roles",
                        address="/roles",
                        caption="Роли",
                        icon="bi bi-shield-shaded")
                  }}
                  {{ FOLDED_MENU_ITEM(
                        active_name=active_menu,
                        name="workflows",
                        address="/workflows",
                        caption="Рабочие процессы",
                        icon="bi bi-diagram-3")
                  }}
                  {{ FOLDED_MENU_ITEM(
                        active_name=active_menu,
                        name="issue_kinds",
                        address="/issue_kinds",
                        caption="Типы запросов",
                        icon="bi bi-card-checklist")
                  }}
                  {{ FOLDED_MENU_ITEM(
                        active_name=active_menu,
                        name="logs",
                        address="/logs",
                        caption="Логи",
                        icon="bi bi-terminal")
                  }}
                {% endif %}
              {#-- /Глваные пункты бокового меню администратора в свёрнутом виде --#}
            </ul>
          {#-- /Глваные пункты бокового меню --#}

          <hr class="hr-line">

          {#-- Пункты меню по ролям --#}
            <ul class="list-unstyled">
              {% for role in project_manager.roles_by_user(user.id) if role.menu_items|length %}
                <li class="nav-item dropdown">
                  <div class="dropend">
                    <a  class="nav-link dropdown-toggle main-list"
                        href="#"
                        id="navbarDarkDropdownMenuLink"
                        role="button"
                        data-bs-toggle="dropdown"
                        aria-expanded="false">
                      <span
                          class="sidebar-link-title role"
                          data-toggle="tooltip"
                          data-placement="right"
                          title="{{ role.caption|e }}">
                        <i class="{{ role.icon|e }}"></i>
                        {% if role.caption|length > 8 %}
                          {{ role.caption[:7]|e }}…
                        {% else %}
                          {{ role.caption|e }}
                        {% endif %}
                      </span>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-dark dropdown-menu-end position-fixed"
                        aria-labelledby="navbarDarkDropdownMenuLink">
                      <li>
                        <h6 class="dropdown-header">
                          <i class="{{ role.icon|e }} mr-8"></i>{{ role.caption|e }}
                        </h6>
                      </li>
                      <li>
                        <hr class="dropdown-divider">
                      </li>
                      {% for menu_item in role.menu_items %}
                        <li class="nav-item">
                          <a  class="dropdown-item nav-link"
                              href="{{ menu_item.link|e }}">
                            <i class="{{ menu_item.icon|e }} mr-8"></i>
                            <span>{{ menu_item.caption[:25]|e }}</span>
                          </a>
                        </li>
                      {% endfor %}
                    </ul>
                  </div>
                </li>
              {% endfor %}
            </ul>
          {#-- /Пункты меню по ролям --#}
        </div>
      </div>
    {#-- /Левое вертикальное боковое меню в свернутом виде --#}

    {#-- Основная область приложения --#}
      <main class="main">

        {#-- Шапка основной области --#}
          <div class="base-topbar">
            <div class="BaseTopbar-pageHeader">
              <div class="TopbarPageHeaderStructure">
                <div class="ProjectPageHeader">

                  {#-- Заголовок основной области --#}
                    <div class="TopbarPageHeader-topSection">
                      <div class="TopbarPageHeader-title">
                        <div class="TopbarPageHeader-titleRow">
                          <div class="site-nav-wrap">
                            <nav class="breadcrumb-nav">
                              {% block breadcrumb %}{% endblock %}
                            </nav>
                          </div>
                        </div>
                      </div>
                    </div>
                  {#-- /Заголовок основной области --#}

                  {#-- Горизонтальное меню с табами --#}
                    {% if tab_menu %}
                      <div class="nav-menu-tab">
                        <div class="tabs-container">
                          <ul class="nav nav-pills" id="pills-tab" role="tablist">
                            {% for tab_menu_item in tab_menu %}
                              {% set menu_item_caption = tab_menu_item[0] %}
                              {% set menu_item_id = tab_menu_item[1] %}
                              <li class="nav-item" role="presentation">
                                <button
                                    class="nav-link {% if loop.first %}active{% endif %}"
                                    id="{{ menu_item_id }}-tab"
                                    data-bs-toggle="pill"
                                    data-bs-target="#{{ menu_item_id }}"
                                    type="button"
                                    role="tab"
                                    aria-controls="{{ menu_item_id }}"
                                    aria-selected="{% if loop.first %}true{% else %}false{% endif %}">
                                  <span class="title-tab">{{ menu_item_caption }} </span>
                                </button>
                              </li>
                            {% endfor %}
                          </ul>
                        </div>
                      </div>
                    {% endif %}
                  {#-- /Горизонтальное меню с табами --#}

                </div>
              </div>

              {#-- Глобальные действия --#}
              <div class="global-actions">
                {#-- Глобальный поиск --#}
                  <div class="search-container">
                    <form
                        class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-1"
                        action="/search">
                      <input
                          type="search"
                          class="form-control"
                          placeholder="Поиск"
                          title="Поиск запросов по наименованию и описанию"
                          maxlength="40"
                          name="search_value">
                    </form>
                  </div>
                {#-- /Глобальный поиск --#}

                {#-- Выпадающий список быстрых действий --#}
                  <div class="action-container dropdown-toggle"
                      id="dropdowAction"
                      data-bs-toggle="dropdown"
                      aria-expanded="false">
                    <svg class="plus-icon" viewBox="0 0 32 32">
                      <path
                        d="M26,14h-8V6c0-1.1-0.9-2-2-2l0,0c-1.1,0-2,0.9-2,2v8H6c-1.1,0-2,0.9-2,2l0,0c0,1.1,0.9,2,2,2h8v8c0,1.1,0.9,2,2,2l0,0c1.1,0,2-0.9,2-2v-8h8c1.1,0,2-0.9,2-2l0,0C28,14.9,27.1,14,26,14z">
                      </path>
                    </svg>
                  </div>

                  <ul class="dropdown-menu text-small shadow"
                      aria-labelledby="dropdowAction">
                    {#-- Быстрое создание запросов --#}
                      {% for issue_kind in project_manager.issue_kinds() %}
                        {% set workflow = project_manager.workflow(issue_kind.workflow_id) %}
                        <li>
                          <a  class="dropdown-item"
                              href="/issues/add_issue?issue_kind_id={{ issue_kind.id }}">
                            Запрос: «{{ workflow.caption|e }} — {{ issue_kind.caption|e }}»
                          </a>
                        </li>
                        {% if loop.last %}
                          <li><hr class="dropdown-divider"></li>
                        {% endif %}
                      {% endfor %}
                    {#-- /Быстрое создание запросов --#}

                    {#-- Быстрое создание проекта --#}
                      <li>
                        <a class="dropdown-item" href="/projects/add_project">
                          <i class="bi bi-clipboard-data menu-icon"></i>
                          Новый проект
                        </a>
                      </li>
                    {#-- /Быстрое создание проекта --#}

                    {% if restriction.is_admin %}
                      {#-- Быстрое создание доски --#}
                        <li>
                          <a class="dropdown-item" href="/boards/add_board">
                            <i class="bi bi-layout-three-columns menu-icon"></i>
                            Новая доска
                          </a>
                        </li>
                      {#-- /Быстрое создание доски --#}

                      {#-- Быстрое создание пользователя --#}
                        <li>
                          <a class="dropdown-item" href="/users/add_user">
                            <i class="bi bi-person-plus menu-icon"></i>
                            Новый пользователь
                          </a>
                        </li>
                      {#-- /Быстрое создание пользователя --#}
                    {% endif %}
                  </ul>
                {#-- /Выпадающий список быстрых действий --#}

                {#-- Выпадающий список работы с текущим пользователем --#}
                  <a  class="profile-btn dropdown-toggle"
                      id="dropdownUser2"
                      data-bs-toggle="dropdown"
                      aria-expanded="false"
                      title="{{ user.last_name }} {{ user.first_name }}">
                    <div class="avatar-container avatar-container-background-{{ user.id % 22 }}">
                      {#-- Индикация, что есть непрочитанные сообщения --#}
                        {% set have_unread_messages = project_manager.have_unread_messages_by_user(user.id) %}
                        {% if have_unread_messages %}
                          <div
                            class="notification">
                          </div>
                        {% endif %}
                      {#-- /Индикация, что есть непрочитанные сообщения --#}

                      {#-- «Аватарка» --#}
                        <div>
                          {% if user.last_name and user.first_name %}
                            {{ user.last_name[0] + user.first_name[0] }}
                          {% endif %}
                        </div>
                      {#-- /«Аватарка» --#}
                    </div>
                  </a>

                  <ul class="dropdown-menu text-small shadow" aria-labelledby="dropdownUser2">
                    <li>
                      <a class="dropdown-item" href="/users/user_profile/{{ user.id }}">
                        <i class="bi bi-check2 menu-icon"></i>
                        {{ user.email|e }}
                      </a>
                    </li>

                    {#-- Моя статистика --#}
                      <li>
                        <a class="dropdown-item"
                            href="/users/user_statistics/{{ user.id }}">
                          <i class="bi bi-pie-chart-fill menu-icon"></i>
                          Моя статистика
                        </a>
                      </li>
                    {#-- /Моя статистика --#}

                    {#-- Мои сообщения --#}
                      <li>
                        <a class="dropdown-item"
                            href="/users/messages/{{ user.id }}">
                          {% if have_unread_messages %}
                            <i class="bi bi-envelope menu-icon"></i>
                            <strong>Мои сообщения</strong>
                          {% else %}
                            <i class="bi bi-envelope-open menu-icon"></i>
                            Мои сообщения
                          {% endif %}
                        </a>
                      </li>
                    {#-- /Мои сообщения --#}

                    <li><hr class="dropdown-divider"></li>

                    {# TODO : Вернуть как появится соответствующая функциональность
                              по настройкам текущего пользователя
                    <li><a class="dropdown-item" href="#">Настройки</a></li>
                    #}

                    <li><a class="dropdown-item" href="/logout">Выйти</a></li>
                  </ul>
                {#-- /Выпадающий список работы с текущим пользователем --#}

              </div>
            </div>
          </div>
        {#-- /Шапка основной области --#}

        {#-- Контент страницы --#}
          <div id="page-content-wrapper" class="content">
            <div class="p-0 container-fluid">
              {% if tab_menu %}
                <div class="tab-content" id="pills-tabContent">
                  {% for tab_menu_item in tab_menu %}
                    {% set menu_item_id = tab_menu_item[1] %}
                    <div
                        class="tab-pane fade {% if loop.first %}show active{% endif %}"
                        id="{{ menu_item_id }}"
                        role="tabpanel"
                        aria-labelledby="{{ menu_item_id }}-tab">
                      <div class="page-content inset">
                        {%- if   1 == loop.index %}{% block tab_content_1 %}{% endblock -%}
                        {%- elif 2 == loop.index %}{% block tab_content_2 %}{% endblock -%}
                        {%- elif 3 == loop.index %}{% block tab_content_3 %}{% endblock -%}
                        {%- elif 4 == loop.index %}{% block tab_content_4 %}{% endblock -%}
                        {%- elif 5 == loop.index %}{% block tab_content_5 %}{% endblock -%}
                        {%- elif 6 == loop.index %}{% block tab_content_6 %}{% endblock -%}
                        {%- elif 7 == loop.index %}{% block tab_content_7 %}{% endblock -%}
                        {%- elif 7 == loop.index %}{% block tab_content_8 %}{% endblock -%}
                        {%- elif 7 == loop.index %}{% block tab_content_9 %}{% endblock -%}
                        {%- endif -%}
                      </div>
                    </div>
                  {% endfor %}
                </div>
              {% else %}
                <div class="page-content inset">
                  {%- block content %}{% endblock -%}
                </div>
              {% endif %}

              {#-- /Всплывающее сообщение о результате операции --#}
                {% if operation_result -%}
                  <div
                      class="toast-container position-fixed bottom-0 end-0 p-3"
                      style="z-index: 1024">
                    <div
                        id="operation_result_toast"
                        class="toast"
                        role="alert"
                        aria-live="assertive"
                        aria-atomic="true">
                      <div class="toast-header">
                        <i class="bi bi-info-circle-fill
                                  text-{{ operation_result.kind }} me-2"></i>
                        <strong class="me-auto">
                          {{ operation_result.caption }}
                        </strong>
                        <button
                            type="button"
                            class="btn-close"
                            data-bs-dismiss="toast"
                            aria-label="Close"></button>
                      </div>
                      {% if operation_result.text %}
                        <div class="toast-body">
                          {{ operation_result.text}}
                        </div>
                      {% endif %}
                    </div>
                  </div>
                  <script>
                    document_ready_functions.push(function() {
                      const toast = new bootstrap.Toast(
                        document.getElementById('operation_result_toast')
                      );
                      toast.show();
                    });
                  </script>
                {%- endif %}
              {#-- /Всплывающее сообщение о результате операции --#}
            </div>
          </div>
        {#-- /Контент страницы --#}

      </main>
    {#-- /Основная область приложения --#}

  </div>

  <script>
    var sidebar = document.querySelector('.left-sidebar');
    var openMenu = document.querySelector('#open-menu');
    var openMenuButton = document.querySelector('#open-menu-button');
    var closeMenuButton = document.querySelector('#close-menu-button');
    var initMenuState = localStorage.getItem('menuOpen');

    function menuOpen() {
      if (sidebar.classList.contains('sidebar--visible')) {
        sidebar.classList.remove('sidebar--visible');
        openMenu.classList.add('hidden');
        localStorage.setItem('menuOpen', 1);
      }
    }

    function menuClose() {
      openMenu.classList.remove('hidden')
      sidebar.classList.add('sidebar--visible')
      localStorage.setItem('menuOpen', 0)
    }

    $(document).ready(function() {
      $('.scrollbar-macosx').scrollbar();

      closeMenuButton.addEventListener('click', menuClose);
      openMenuButton.addEventListener('click', menuOpen);

      if (initMenuState == 1) {
        menuOpen();
      } else {
        menuClose();
      }
      setTimeout(() => {sidebar.classList.add('left-sidebar-animation')}, 500);
    });

    {# Переход к указанной вкладке в горизонтальном меню с табами в результате операции #}
      {% if operation_result and operation_result.tab_name %}
        document_ready_functions.push(function() {
          $('#pills-tab button[data-bs-target="#{{ operation_result.tab_name }}"]').tab('show');
        });
      {% endif %}
    {# /Переход к указанной вкладке в горизонтальном меню с табами в результате операции #}

    $(document).ready(function () {
      $(".collapse").on("shown.bs.collapse", function () {
        localStorage.setItem("coll_" + this.id, true);
      });

      $(".collapse").on("hidden.bs.collapse", function () {
        localStorage.removeItem("coll_" + this.id);
      });

      $(".collapse").each(function () {
        if (localStorage.getItem("coll_" + this.id) === "true") {
          $(this).collapse("show");
        }
        else {
          $(this).collapse("hide");
        }
      });
    });
  </script>

  {# INFO : Глобальные переменные document_ready_function
            и document_ready_functions применяются для добавления javascript-кода,
            который должен выполниться сразу после загрузки страницы.
            Пример:
              document_ready_functions.push(function() {
                alert(1);
              });
  #}
  <script>
    var document_ready_function;
    $(document).ready(function() {
        if (document_ready_function instanceof Function) {
            document_ready_function();
        }
        if (Array.isArray(document_ready_functions)) {
            document_ready_functions.forEach(element => element());
        }
    });
  </script>

  {% block scripts %}{% endblock %}

</body>

</html>
